<!doctype html>
<html lang="en">

	<head>
		<meta charset="UTF-8" />
		<title>Document</title>
	</head>

	<script src="js/jquery.js" type="text/javascript"></script>
	<script type="text/javascript">
		function addFile() {
			var div = document.createElement("div");
			var f = document.createElement("input");
			f.setAttribute("type", "file")
			f.setAttribute("name", "File")
			f.setAttribute("size", "50")
			f.setAttribute("onchange", "setImg(this)");
			var img = document.createElement("img");
			img.setAttribute("name", "FileImg");
			img.setAttribute("src", "");
			div.appendChild(f)
			div.appendChild(img);
			var d = document.createElement("input");
			d.setAttribute("type", "button")
			d.setAttribute("onclick", "deteFile(this)");
			d.setAttribute("value", "移除")
			div.appendChild(d)
			document.getElementById("_container").appendChild(div);
		}
		//返回选取的图片的路径
		function getValue(obj) {
			obj.select(); //该对象选取   
			return document.selection.createRange().text; //返回选取项的文本内容  
		}

		function setImg(t) {
			if (!/\.((jpg)|(bmp)|(gif)|(png))$/ig.test($(t).val())) {
				alert('只能上传jpg,bmp,gif,png格式图片!');
				return;
			}
			alert("123");
			alert(getPath(t));
			$(t).closest("div").find("img").attr("src", 'file:///' + getPath(t));
			$(t).closest("div").find("img").attr("height", 50);
			$(t).closest("div").find("img").attr("width", 50);
		}

		function deteFile(o) {
			while (o.tagName != "DIV") o = o.parentNode;
			o.parentNode.removeChild(o);
		}
		//返回选取的图片的路径
		function getPath(obj) {
			alert(window.navigator.userAgent);
			if (obj) {
				if (window.navigator.userAgent.indexOf("MSIE") >= 1) {
					obj.select();
					return document.selection.createRange().text;
				}
				elseif(window.navigator.userAgent.indexOf("Firefox") >= 1) {
					if (obj.files) {
						return obj.files.item(0).getAsDataURL();
					}
					return obj.value;
				}
				return obj.value;
			}
		}

		function CheckImgCss(img) {
			if (!/\.((jpg)|(bmp)|(gif)|(png))$/ig.test(o.value)) {
				alert('只能上传jpg,bmp,gif,png格式图片!');
			} else {
				$(img).filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = o.value;
				//$('Image1').src = o.value;//这里IE7已经不支持了。所以才有上面的方法。
			}
		}
	</script>

	<body>
		<form id="form1" runat="server" method="post" enctype="multipart/form-data">
			<h3>
        多文件上传</h3>
			<div id="_container">
				<div>
					<input type="file" size="50" name="File" onchange="javascript:setImg(this)" />
					<img name="FileImg" src="" alt="" />
				</div>
			</div>
			<div>
				<input type="button" value="添加文件(Add)" onclick="addFile()" />
			</div>
			<div style="padding: 10px 0">
				<asp:Button runat="server" Text="开始上传" ID="UploadButton" OnClick="UploadButton_Click">
				</asp:Button>
			</div>
			<div>
				<asp:Label ID="strStatus" runat="server" Font-Names="宋体" Font-Bold="True" Font-Size="9pt" Width="500px" BorderStyle="None" BorderColor="White"></asp:Label>
			</div>
		</form>
	</body>

</html>